<template>
    <div class="prescription-right-detail">
        <div class="title">就诊/处方详情</div>
        <div class="card">
            <DetailInfo :dataList="dataInfo.detail" />
            <DetailTable :tableConfig="tableConfig" :tableData="tableData" />
            <div class="total">药品总金额：<span>{{ dataInfo.total }}</span></div>
        </div>
        <div class="card">
            <div class="card-title">预警项</div>
            <DetailTable :tableConfig="warningTableConfig" :tableData="warningTableData" />
        </div>
    </div>
</template>
<script>
import DetailInfo from '@/components/detail-info/index.vue'
import DetailTable from '@/components/detail-table/index.vue'

export default {
    name: 'PrescriptionRightDetail',
    components: { 
        DetailInfo,
        DetailTable
    },
    data() {
        return {
            dataInfo: {
                detail: [
                    {
                        label: '就诊流水号',
                        value: '1221321'
                    },
                    {
                        label: '就诊日期',
                        value: '2024-03-12 15:20:00'
                    },
                    {
                        label: '处方流水号',
                        value: '1221321'
                    },
                    {
                        label: '处方日期',
                        value: '2024-03-12 15:20:00'
                    },
                    {
                        label: '医院',
                        value: '板桥'
                    },
                    {
                        label: '就诊科室',
                        value: '皮肤科'
                    },
                    {
                        label: '诊历',
                        value: '初诊/复诊'
                    },
                    {
                        label: '就诊类型',
                        value: '普通/专家/急诊'
                    },
                    {
                        label: '医生姓名',
                        value: '王博一'
                    },
                    {
                        label: '医生编号',
                        value: '15921798'
                    },
                    {
                        label: '医生身份证号',
                        value: '1591798'
                    },
                    {
                        label: '患者姓名',
                        value: '王方'
                    },
                    {
                        label: '患者性别',
                        value: '男'
                    },
                    {
                        label: '患者年龄',
                        value: '30'
                    },
                    {
                        label: '主诉内容',
                        value: '头昏'
                    },
                    {
                        label: '疾病名称',
                        value: '感染病毒'
                    },
                ],
                total: 230.39
            },
            tableConfig: [
                {   
                    field: 'name',
                    title: '药品名称',
                },
                {
                    field: 'spec',
                    title: '规格medicSpec',
                },
                {
                    field: 'type',
                    title: '剂型medicType',
                },
                {
                    field: 'usedosag',
                    title: '单次剂量medicUsedosag',
                },
                {
                    field: 'days',
                    title: '日数medicDays',
                },
                {
                    field: 'quantity',
                    title: '数量medicQuantity+medicUnit',
                },
                {
                    field: 'price',
                    title: '价格price',
                }
            ],
            tableData: [
                {
                    name: '米卡分静',
                    spec: '80mg*7片',
                    type: '片剂',
                    usedosag: '80mg',
                    days: 20,
                    quantity: '4盒',
                    price: 230.39,
                }
            ],
            warningTableConfig: [
                {   
                    field: 'order',
                    title: '序号',
                },
                {   
                    field: 'rule',
                    title: '预警规则',
                },
                {   
                    field: 'content',
                    title: '预警内容',
                },
            ],
            warningTableData: [
                {
                    order: 1,
                    rule: '抗菌药物处方权规则',
                    content: '“吴俊“的抗菌药物处方权为“无抗菌药物权限”'
                },
                {
                    order: 2,
                    rule: '药品/项目名称药物规则',
                    content: '(4+7国基)头孢呋辛酯片”为非限制使用级抗菌药物'
                }
            ]
        }
    },
}
</script>
<style scoped lang="scss">
.prescription-right-detail {
    height: 100%;
    display: flex;
    flex-direction: column;

    .title {
        margin-top: 10px;
        font-weight: bold;
        font-size: 26px;
        line-height: 26px;
        color: #4B4B4B;
    }

    .detail-table {
        margin-top: 13px;
    }

    .total {
        margin-top: 29px;
        font-weight: 500;
        font-size: 16px;
        color: #8B8B8B;

        span {
            color: #4B4B4B;
        }
    }
}
.card {
    background-color: #fff;
    padding: 5px 13px 19px;
    margin-top: 14px;
}
.card-title {
    font-weight: bold;
    font-size: 20px;
    color: #4B4B4B;
    line-height: 48px;
}
</style>